<script>
import axios from "axios";

export default {
  name: "permissionDialog",
  data() {
    return {
      form: {
        id: null,
        departmentName: "",
        staffCount: "",
        intro: ""
      },
      formLabelWidth: '120px',
      dataTree:[],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    }
  },
  methods: {
    sendDataParent: function () {
      console.log("执行取消")
      console.log(this.$emit)
      this.$emit('closeDialog', false);
    },
    updateData() {
      axios.put("http://localhost:8088/departments", this.form).then(
          function (res) {
            console.log("请求成功")
            console.log(res.data)
          },
          function (error) {
            console.log("请求失败")
          }
      )
      this.$emit('closeDialog', false);
      this.$emit('refresh', true);
    },
    getPermissionIds() {
      console.log("拿到数据对象")
      console.log(this.$refs.tree.getCheckedKeys())
      console.log(this.rowData.id)
      let param = {
        id:this.rowData.id,
        permissionIds:this.$refs.tree.getCheckedKeys()
      }
      axios.post("http://localhost:8088/roles/addPermissionForRole", param).then(
          function (res) {
            console.log("请求成功")
            console.log(res.data)
          },
          function (error) {
            console.log("请求失败")
          }
      )
      this.$emit('closeDialog', false);
    },
  },
  props: ['dialogFormShow', 'rowData'],
  created() {
    console.log("修改页面初始化")
    console.log("选中列数据" + this.rowData)
  },
  mounted() {
    console.log("选中列数据" + this.rowData)
  },
  activated() {
    console.log("组件激活")
  },
  watch: {
    dialogFormShow: function (newValue, oldValue) {
      if (newValue === true) {
        let vue = this
        axios.get("http://localhost:8088/permissions/treeData").then(
            function (res) {
              console.log("请求成功")
              console.log(res.data)
              vue.dataTree = res.data.data
              console.log(vue.dataTree)
            },
            function (error) {
              console.log("请求失败")
            }
        )
      }
    }
  }
}
</script>

<template>
  <el-container>
    <el-dialog title="新增部门" :visible.sync="dialogFormShow" @close="sendDataParent">
      <el-form :model="form">
        <el-tree
            :data="dataTree"
            show-checkbox
            default-expand-all
            node-key="id"
            ref="tree"
            highlight-current
            :props="defaultProps"
        >
        </el-tree>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="sendDataParent">取 消</el-button>
        <el-button type="primary" @click="getPermissionIds">确 定</el-button>
      </div>
    </el-dialog>

  </el-container>
</template>

<style scoped>

</style>
